<template>
  <div>
    <div>
      <van-nav-bar title="社区"
                   class="title"></van-nav-bar>
      <b-tabs content-class="mt-3"
              align="center">
        <b-tab title="话题"
               active>
          <van-pull-refresh v-model="isLoading"
                            @refresh="onRefresh">
            <CommunityMain v-for="(item, index) in listItem"
                           :key="index"
                           v-bind="item"
                           :index="index"
                           @addLike="addLike"
                           @addComment="addComment" />
          </van-pull-refresh>
        </b-tab>
        <b-tab title="邻里">
          <chathome-com />
        </b-tab>
      </b-tabs>
    </div>
  </div>
</template>

<script>

import chathomeCom from './Chathome'
import CommunityMain from '@/components/Community/CommunityMain'
import { listItem } from './index.js'
import { Toast } from 'vant'
export default {
  components: {
    chathomeCom,
    CommunityMain
  },
  data () {
    return {
      listItem,
      count1: 0,
      isLoading: false,
      checked: true,
      images: [
        '@/assets/images/communityphoto/lb-1.jpg'
        // 'https://img.yzcdn.cn/vant/apple-2.jpg'
      ]
      // photos: [
      //   '@/assets/images/communityphoto/lb-1.jpg',
      //   '@/assets/images/communityphoto/lb-2.jpg',
      //   '@/assets/images/communityphoto/lb-3.jpg'
      // ]
    }
  },
  methods: {
    addLike (index, count, flag) {
      if (flag) {
        this.listItem[index].count++
      } else {
        this.listItem[index].count--
      }
      this.listItem[index].isflag = !this.listItem[index].isflag
    },
    addComment (index, comment) {
      this.listItem[index].comment++
    },
    onRefresh () {
      setTimeout(() => {
        Toast('刷新成功')
        this.isLoading = false
        this.count1++
      }, 1000)
    }
  }
}
</script>
<style scoped>
.my-swipe .van-swipe-item {
  color: #fff;
  font-size: 20px;
  line-height: 110px;
  text-align: center;
  background-color: #39a9ed;
}
.van-nav-bar {
  background-color: rgb(114, 202, 205);
  margin-bottom: 10px;
}
::v-deep .van-icon,
::v-deep .van-nav-bar__text,
::v-deep .van-ellipsis {
  color: #fff;
}
</style>
